<template>
	<view>
		<page-top title="生产日报表-日志明细">
			<view class="" slot="left">
				<u-icon @click="clickPageTopEv" color="#FFFFFF" size="16px" name="arrow-left"></u-icon>
			</view>
		</page-top>
		<view class="mf-data">
			<u-cell-group :border="false">
				<u-cell :border="true">
					<view slot="title">
						<u-row>
							<u-col span="6">
								<view>{{mfData.wr_no}}</view>
							</u-col>
							<u-col span="6">
								<view class="text-right">{{mfData.wr_dd}}</view>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="6">
								<view>{{mfData.dep_name}}</view>
							</u-col>
							<u-col span="6">
								<view class="text-right">{{mfData.sal_name}}</view>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="12">
								<view>{{mfData.rem}}</view>
							</u-col>
						</u-row>
					</view>
				</u-cell>

			</u-cell-group>
		</view>
		<view class="data-list">
			<jp-virtual-list ref="search11" code="id" :refresher="false" class="mf-data" :lazy="true" :pageSizes="4000"
				:data="tfData">
				<template v-slot="{ list }">
					<view class="data-list-itm" v-for="(itm,index) in list" :key="itm.id">
						<u-row>
							<u-col span="12">
								<view>成品代号：{{itm.prd_no}}</view>
							</u-col>

						</u-row>
						<u-row>

							<u-col span="12">
								成品名称：{{itm.prd_name}}
							</u-col>
						</u-row>
						<u-row>
							<u-col span="12">
								<view>制令单号：{{itm.mo_no}}</view>
							</u-col>

						</u-row>
						<u-row>

							<u-col span="12">
								通知单号：{{itm.tz_no}}
							</u-col>
						</u-row>
						<u-row>
							<u-col span="12">
								<view> 已产出量：{{itm.qty_fin}}</view>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="12">
								<view> 生产工时：{{itm.time_used}}</view>
							</u-col>
						</u-row>

					</view>
				</template>
			</jp-virtual-list>
		</view>


		<view class="delete">
			<u-tag @click="deleteShow = true" text="删除" plain> </u-tag>
		</view>
		<!-- 删除弹窗 -->
		<u-modal showCancelButton showConfirmButton @cancel="deleteShow = false" @confirm="deleteEv" :show="deleteShow"
			title="删除提示">
			<view class="slot-content" style="text-align: center;">
				确定永久删除此单据吗？
			</view>
		</u-modal>
	</view>
</template>

<script>
	import jpVirtualList from '@/components/jp-virtual-list/jp-virtual-list.vue';
	import pageTop from '@/components/pageTop.vue';
	import {
		basicBgListPkApiGet,
		basicBgListPkApiDelete
	} from '@/common/api/basic.js';

	export default {
		components: {
			pageTop: pageTop,
			jpVirtualList: jpVirtualList
		},
		data() {
			return {
				search: '',
				no: '',
				mfData: {
					wr_dd: '',
					wr_no: ''
				},
				tfData: [],
				deleteShow: false
			}
		},
		async onLoad(e) {
			this.search = e.search
			this.no = e.no
			await this.searchGetEv(this.no)

		},
		methods: {
			// 查询数据
			async searchGetEv(no) {
				try {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					let arr_data = await basicBgListPkApiGet(no)
					uni.hideLoading();
					if (arr_data.statusCode == 202) {

						uni.showModal({
							content: arr_data.data.msg,
							showCancel: false
						});

						return
					}
					if (arr_data.statusCode !== 200) {
						uni.showModal({
							content: '查询数据失败',
							showCancel: false
						});

						return
					}
					this.mfData = arr_data.data.result.mf
					this.tfData = arr_data.data.result.tf
				} catch (err) {
					//TODO handle the exception
					uni.hideLoading();
					let message = '接口请求失败请联系管理员'
					if (err.statusCode == 401) {
						message = err.data.msg
					}
					uni.showModal({
						content: message,
						showCancel: false
					});
				}
			},
			clickPageTopEv(val) {

				// uni.redirectTo({
				// 	url: '/pages/ty/log?search=' + this.search
				// });
				let pages = getCurrentPages(); // 当前页页⾯实例
				let prevPage = pages[pages.length - 2]; // 上一页面实例


				prevPage.$vm.navigateBackEv(JSON.parse(this.search)) // 调用上一页 定义的方

				uni.navigateBack({
					delta: 1
				});

			},

			// 删除数据
			async deleteEv() {
				this.deleteShow = false
				try {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					let arr_data = await basicBgListPkApiDelete(this.mfData.wr_no)

					uni.hideLoading();

					if (arr_data.statusCode == 202) {

						uni.showModal({
							content: arr_data.data.msg,
							showCancel: false
						});

						return
					}
					if (arr_data.statusCode !== 200) {
						uni.showModal({
							content: '删除数据失败',
							showCancel: false
						});

						return
					}
					const that = this
					uni.showModal({
						content: '删除成功',
						showCancel: false,
						success: function(res) {
							if (res.confirm) {
								that.clickPageTopEv()
							}
						}
					});

				} catch (err) {
					//TODO handle the exception
					console.log(err)
					uni.hideLoading();
					let message = '接口请求失败请联系管理员'
					if (err.statusCode == 401) {
						message = err.data.msg
					}
					uni.showModal({
						content: message,
						showCancel: false
					});
				}
			}
		}

	}
</script>

<style lang="scss">
	.mf-data {
		.u-cell-group-label {
			color: #909399;
			font-size: 25rpx;

			.itm {
				height: 25px;
				line-height: 25px;
			}
		}
	}

	.data-list {
		font-size: 25rpx;

		.data-list-itm {
			margin: 10px;
			box-sizing: border-box;
			border: 1px solid var(--common-border-color);
			border-radius: 10px;
			position: relative;
			color: #606266;

			.u-row {
				padding-left: 10px;
				padding-right: 10px;
				padding-top: 5px;
				padding-bottom: 5px;
			}

			.del {
				position: absolute;
				top: 0;
				right: 0;
			}
		}
	}

	.delete {
		position: fixed;
		top: 50%;
		right: 15rpx;
	}

	/deep/ .u-tag--medium {
		margin-bottom: 15px;
		padding: 0 !important;
		border-radius: 50% !important;
		height: 35px;
		width: 35px;
		font-size: 20px;
		text-align: center;
		display: flex;
		align-items: center;
		justify-content: center;

		.u-tag__text--medium {
			width: 100%;
		}
	}

	.slot-content {
		width: 100%;
	}

	/deep/ .u-transition {
		z-index: 200 !important;
	}

	/deep/ .u-cell__body__content {
		font-size: 25rpx;
	}

	/deep/ .u-cell-group-label {
		font-size: 25rpx !important;
	}
</style>